﻿<UserControl x:Class="FluidKit.Samples.ItemSkimmingPanel.ItemSkimmingExample"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:Controls="clr-namespace:FluidKit.Controls;assembly=FluidKit"
             xmlns:Samples="clr-namespace:FluidKit.Samples">
    <UserControl.Resources>
        <DataTemplate x:Key="StringTemplate">
            <Border BorderThickness="2,2,2,2"
                    BorderBrush="Black"
                    CornerRadius="8"
                    Background="White">
                <Image Source="{Binding}"
                       VerticalAlignment="Center"
                       HorizontalAlignment="Center" />
            </Border>
        </DataTemplate>

        <ControlTemplate x:Key="VisualHostPanelTemplate">
            <Border BorderBrush="LightGray"
                    BorderThickness="1,5,1,5"
                    CornerRadius="3,3,3,3">
                <StackPanel Orientation="Horizontal"
                            x:Name="PART_ContextPanel" />
            </Border>
        </ControlTemplate>

        <ControlTemplate x:Key="VisualTemplate">
            <Border x:Name="Border"
                    BorderBrush="LightGray"
                    BorderThickness="1"
                    CornerRadius="3"
                    Width="32"
                    Height="32"
                    Background="{TemplateBinding Background}"
                    Margin="1,2,1,2" />
            <ControlTemplate.Triggers>
                <Trigger Property="IsFocused"
                         Value="True">
                    <Setter Property="BorderBrush"
                            Value="Gray"
                            TargetName="Border" />
                    <Setter Property="BorderThickness"
                            Value="1,3,1,3"
                            TargetName="Border" />
                    <Setter Property="Width"
                            Value="48"
                            TargetName="Border" />
                    <Setter Property="Height"
                            Value="48"
                            TargetName="Border" />

                </Trigger>
            </ControlTemplate.Triggers>
        </ControlTemplate>

        <ItemsPanelTemplate x:Key="ItemPanelTemplate">
            <Controls:ItemSkimmingPanel IsItemsHost="True"
                                        Margin="0,60,0,0"
                                        ContextContainerTemplate="{StaticResource VisualHostPanelTemplate}"
                                        ContextItemTemplate="{StaticResource VisualTemplate}" />
        </ItemsPanelTemplate>

    </UserControl.Resources>
    <ItemsControl x:Name="ItemsList"
                  ItemTemplate="{StaticResource StringTemplate}"
                  ItemsPanel="{StaticResource ItemPanelTemplate}"
                  Margin="10" 
                  HorizontalAlignment="Left"
                  VerticalAlignment="Center"
                  Width="200"
                  Height="300"/>
</UserControl>